import React from 'react'
import { connect } from 'dva'
import { Row, Col } from 'antd'
import DefinitionList from '../../../components/DefinitionList'

/**
 * [TraderQuota 交易员指标]
 */
class TraderQuota extends React.Component {
  state = {
    data: this.props.traderQuota
  }
  componentDidMount(){
    this.fetchData(this.props)
  }
  componentWillReceiveProps(nextProps) {
    if ((nextProps.begindate !== this.props.begindate) || (nextProps.enddate !== this.props.enddate) || (nextProps.trader !== this.props.trader)) {
      this.fetchData(nextProps)
    }
    if (nextProps.traderQuota !== this.props.traderQuota) {
      this.setState({
        data: nextProps.traderQuota
      })
    }
  }
  fetchData = (props) => {

    this.props.dispatch({
      type: `dailyReplay/getTraderQuota`,
      payload:props
    })
  }


  render() {
    const { fieldList = [], trader = {} } = this.state.data
    const theFieldList = (this.props.trader === 'total') ? fieldList.filter(item => item.id !== 'trader') : fieldList
    console.log('traderQuota>theFieldList',theFieldList,this.state.data)
    return (
      <Row className='traderQuota'>
        {
          theFieldList.map((item, index) => (
            <Col key={index} xs={12} sm={8} md={6} lg={6} xl={6}>
              <DefinitionList name={`${item.name}:`} value={trader[item.id]} />
            </Col>
          ))
        }
      </Row>
    )
  }
}
TraderQuota.defaultProps = {
  begindate: null,
  enddate: null,
  trader: 'total',
  traderQuota: {
    fieldList: [], trader: []
  }
}

export default connect()(TraderQuota)
